<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
		<meta http-equiv="X-UA-Compatible" content="IE=7" />
		<link rel="stylesheet" type="text/css" href="../layout.css"/>
		<link rel="stylesheet" type="text/css" href="layout.css"/>
		<script type = "text/javascript" src="../Tcommonzip.js"></script>
		<script type = "text/javascript" src="../API.js"></script>
		<script type = "text/javascript" src="../context.js"></script>
		<script type = "text/javascript" src="../MD5.js"></script>
	</head>
	<body>
		<script type="text/javascript">
		var Emulator={
			'GameInfo':{
				'Name':'Game 1',
				'ID':'2',
				'SecretKey':'G41uasttH5MuKD61dPlhMoQLlCwbG'
			},
			'controls':sys_element_create("div",{
				'id':'controls',
				'log':sys_element_create("div",{
					'id':'log_border',
					'statistic':sys_element_create("div",{
						'mac_address':sys_element_create("div",{})
					},true),
					'result':sys_element_create("div",{},true),
					'log':function(rs){
						if(rs.return != null && rs.return != ""){
							var display = sys_element_create("div",{"style":{
								'border-top':'1px dotted',
								'background':(rs.return=='true'?'#F8F8FF':'#FFFAF0'),
								'padding':'1px',
								'z-index':'0'
							}},true);
							if(rs.errors != null){
								display.error = sys_element_create("div",{"style":{"position":"relative"}},true);
								for(var i = 0; i < rs.errors.length; i++){
									display.error.appendChild(sys_element_create("div",{
										'code':sys_element_create("div",{'innerHTML':rs.errors[i].code,'className':'error_code'}),
										'message':sys_element_create("div",{'innerHTML':rs.errors[i].message,'className':'error_message'})
									},true));
								}
								display.appendChild(display.error);
							}
							if(rs.messages!=null){
								display.message = sys_element_create("div",{"style":{"position":"relative"}},true);
								for(var i = 0; i< rs.messages.length; i++){
									if(rs.messages[i].name == 'content')continue;
									display.message.appendChild(sys_element_create("div",{
										'code':sys_element_create("div",{'innerHTML':rs.messages[i].message,'className':'item_message'},true)
									},true));
								}
								display.appendChild(display.message);
							}
							display.appendChild(sys_element_create("br",{"className":"clear"}));
							Emulator.controls.log.result.appendChild(display);
							Emulator.controls.log.result.scrollTop = Emulator.controls.log.result.scrollHeight;
						}
					},
				},true),
				'emulator':sys_element_create("div",{
					'id':'emulator',
					'overall':sys_element_create("div",{'className':'emu_overall'}),
					'border':sys_element_create("div",{
						'id':'emu_border'
					},true)
				},true),
				'br':sys_element_create("br",{'className':'clear'},true)
			},true),
			'forms':{
				'newLogin':function(){
					var loginfrm = sys_element_create("div",{
						'id':'frmlogin',
						'dimension':'w:parentWidth;h:parentHeight',
						'email_address':sys_element_create("div",{
							'title':sys_element_create("div",{'innerHTML':"Email Address"}),
							'input':sys_element_create("input",{'dimension':'w:parentWidth - 2;'})
						},true),
						'password':sys_element_create("div",{
							'title':sys_element_create("div",{'innerHTML':"Password"}),
							'input':sys_element_create("input",{"type":'password','dimension':'w:parentWidth - 2;'})
						},true),
						'tools':sys_element_create("div",{
							'button':sys_element_create("button",{"innerHTML":"login"}),
							'signup':sys_element_create("a",{"innerHTML":"Signup",'href':'#'}),
							'skip':sys_element_create("a",{"innerHTML":"skip",'href':'#'})
						},true)
					},true);
					loginfrm.tools.button.parent = loginfrm;
					sys_event_attach('click',loginfrm.tools.button,function(evt){
						var actor = sys_event_getActor(evt);
						var email = actor.parent.email_address.input.value;
						var password = actor.parent.password.input.value;
						if(API.login(email,password)){
							API.getCertificate();
							Emulator.changeState('logedin');
						}else{
							actor.parent.email_address.input.value = '';
							actor.parent.password.input.value = '';
						}
					});
					return loginfrm;
				},
				'newSignup':function(){
					var signupfrm = sys_element_create("div",{
						'id':'frmlogin',
						'email_address':sys_element_create("div",{
							'title':sys_element_create("div",{'innerHTML':"Email Address"}),
							'input':sys_element_create("input")
						},true),
						'password':sys_element_create("div",{
							'title':sys_element_create("div",{'innerHTML':"Password"}),
							'input':sys_element_create("input",{"type":'password'})
						},true),
						'tools':sys_element_create("div",{
							'button':sys_element_create("button",{"innerHTML":"Signup"}),
							'cancel':sys_element_create("button",{"innerHTML":"Cancel"})
						},true)
					},true);
					return signupfrm;
				},
				'newWorking':function(){
					var working = sys_element_create("div",{
						'dimension':'w:parentWidth;h:parentHeight;',
						'header':sys_element_create("div",{
							'id':'emu_working_area',
							'dimension':'w:parentWidth;',
							'style':{
								'height':'25px',
								'overflow':'hidden',
								'position':'relative'
							},
							'username':sys_element_create("div",{
								'innerHTML':API.getUserID(),
								'dimension':'w:parentWidth - 50',
								'style':{
									'overflow':'hidden',
									'cssFloat':'left'
								}
							},true),
							'logout':sys_element_create("button",{
								'innerHTML':'logout',
								'style':{
									'width':'49px',
									'height':'25px',
									'cssFloat':'left'
								}
							},true),
							'br':sys_element_create('br',{'className':'clear'})
						},true),
						'working_area':sys_element_create("div",{
							'dimension':'w:parentWidth;h:parentHeight - 50;'
						},true),
						'footer':sys_element_create("div",{
							'dimension':'w:parentWidth;',
							'style':{
								'height':'25px'
							},
							'leaderboard':sys_element_create('button',{'innerHTML':'leader'}),
							'friend':sys_element_create('button',{'innerHTML':'friend'}),
							'request':sys_element_create('button',{'innerHTML':'request'}),
							'game':sys_element_create('button',{'innerHTML':Emulator.GameInfo.Name})
						},true)
					},true);
					sys_event_attach('click',working.header.logout,function(evt){
						API.logout();
						Emulator.changeState('logout');
					});
					sys_event_attach('click',working.footer.game,function(evt){
						Emulator.changeForm(Emulator.forms.newGameTab(),working.working_area);
					});
					return working;
				},
				'newLeaderBoardTab':function(){
				},
				'newFriendTab':function(){
				},
				'newRequestTab':function(){
				},
				'newGameTab':function(){
					var gametab = sys_element_create("div",{
						'dimension':'w:parentWidth;h:parentHeight',
						'info':sys_element_create("div",{
							'secrettitle':sys_element_create('div',{'innerHTML':'SecretKey'}),
							'secretvalue':sys_element_create('div',{'innerHTML':Emulator.GameInfo.SecretKey})
						},true),
						'putscore':sys_element_create("div",{
							'title':sys_element_create('div',{'innerHTML':'Played Score'}),
							'score':sys_element_create('input'),
							'button':sys_element_create('button',{'innerHTML':'Submit'})
						},true)
					},true);
					gametab.putscore.button.parent = gametab;
					sys_event_attach('click',gametab.putscore.button,function(evt){
						var actor = sys_event_getActor(evt);
						var score = parseInt(gametab.putscore.score.value);
						if(score > 0){
							var userid = API.getUserID();
							var gameid = Emulator.GameInfo.ID;
							var secretkey = Emulator.GameInfo.SecretKey;
							var submitstr = ""+gameid+userid+score+secretkey;
							var hashmd5 = MD5(submitstr);
							var rs = API.request("putScore","xml","appid=1&gameid="+ gameid +"&score=" + score + "&key=" + hashmd5);
						}else{
							alert("invalid score");
						}
					});
					return gametab;
				}
			},
			'changeForm':function(frm,receiver){
				function resize_child(obj){
					if(obj.childNodes){
						var flag = false;
						var dimension = '';
						if(obj.dimension){
							dimension = obj.dimension;
							flag = true;
						}else if(obj.getAttribute){
							dimension = obj.getAttribute("dimension");
							flag = true;
						}
						if(flag){
							Context.controls.dimension(obj,dimension);
							for(var i = 0; i < obj.childNodes.length; i++){
								resize_child(obj.childNodes[i]);
							}
						}
					}
				};
				if(receiver == null) receiver = this.controls.emulator.border;
				receiver.innerHTML = '';
				if(frm && frm.innerHTML){
					receiver.appendChild(frm);
				}else{
					receiver.innerHTML = frm;
				}
				resize_child(receiver);
			},
			'changeState':function(state){
				if(state == "logedin"){
					this.changeForm(Emulator.forms.newWorking());
				}else if(state == 'logout'){
					this.changeForm(Emulator.forms.newLogin());
				}
			},
			'resize':function(){
				function resize_child(obj){
					if(obj.childNodes){
						var flag = false;
						var dimension = '';
						if(obj.dimension){
							dimension = obj.dimension;
							flag = true;
						}else if(obj.getAttribute){
							dimension = obj.getAttribute("dimension");
							flag = true;
						}
						if(flag){
							Context.controls.dimension(obj,dimension);
							for(var i = 0; i < obj.childNodes.length; i++){
								resize_child(obj.childNodes[i]);
							}
						}
					}
				};
				var browsersize=sys_browser_getSize();
				this.controls.style.width = (browsersize.width)+'px';
				this.controls.style.height = (browsersize.height)+'px';
				Context.controls.dimension(this.controls.log,"w:parentWidth/100*40;h:parentHeight;");
				Context.controls.dimension(this.controls.emulator,"w:parentWidth/100*59;h:parentHeight;");
				resize_child(this.controls.emulator.border);
			}
		};
		API.resultListener = Emulator.controls.log.log;
		sys_element_appendRoot(Emulator.controls);
		Emulator.resize();
		window.onresize = function(){
			Emulator.resize();
		}
		Emulator.controls.log.statistic.mac_address.innerHTML = '<div><b>MAC: ' + API.getMacAddress() +'</b>. <i><span style="color:#FF0000;">This is a auto genertated id for your browser. It is value on test only.</span></i></div>';
		if(API.loginByCertificate()){
			Emulator.changeState('logedin');
		}else{
			Emulator.changeForm(Emulator.forms.newLogin());
		}
		</script>
	</body>
</html>